<template>
<div class="uploaded">
  <div class="left">
    <el-menu
        default-active="1"
        class="el-menu-vertical-demo"
    >
      <el-menu-item index="1">
        <span>视频</span>
      </el-menu-item>
      <el-menu-item index="2">
        <span>图文</span>
      </el-menu-item>
    </el-menu>
  </div>
  <div class="right">
    <h2>我的视频</h2>
    <FiveColVideoList :has-nickname="false" :data-list="videoList"></FiveColVideoList>
  </div>
</div>
</template>
<script setup>

import FiveColVideoList from "@/components/FiveColVideoList.vue";
import {onMounted, ref} from "vue";
import {getSubmitVideo} from "@/api/api.js";
import {useRoute} from "vue-router";

const videoList = ref([])
let currentUserId = 0
const route = useRoute()

const pageForm = {
  page:1,
  pageSize:15
}
onMounted(async ()=>{
  const userId = route.params.userId
  if(userId){
    console.log(userId)
    currentUserId = userId
  }
  const res = await getSubmitVideo(currentUserId,pageForm)
  console.log(res)
  videoList.value = res.data.records
})
</script>
<style lang="scss" scoped>
.uploaded{
  display: flex;
  .left{
    width: 170px;
    height: 200px;
    //background-color: red;
    margin-right: 15px;
  }
  .right{
    width: 1210px;
  }
}
</style>